<!--
 * @LastEditTime: 2023-10-09 14:46:34
 * @FilePath: \bdcar-net\src\views\comlbs\equipmentManagement\importInfo.vue
-->
<template>
    <el-form :inline="true" :rules="rules" ref="importRef" :model="updateInfo" label-width="80px" style="height:220px"
        :disabled="disabled">
        <el-form-item label="导入模板" prop="name">
            <div style="color:green;cursor:pointer" @click="downloadTemplate">导入模板.xlxs</div>
        </el-form-item>
        <el-form-item label="导入公司" prop="companyId">
            <el-tree-select v-model="updateInfo.companyId" clearable :data="sel_option.companyId"
                :expand-on-click-node="false" :render-after-expand="false" check-strictly :props="{ label: 'label' }"
                node-key="id" filterable placeholder=" " />
        </el-form-item>
        <el-form-item label="上传文件" prop="name">
            <span class="required">*</span>
            <el-upload action="#" :multiple="false" :auto-upload="false" :on-change="changeFile" :limit="1"
                style="display: inline-block;" accept=".xls, .xlsx, .csv" ref="importRef">
                <el-button>点击上传</el-button>
            </el-upload>
        </el-form-item>
    </el-form>
</template>
<script setup>
import axios from 'axios'
import { ref } from 'vue';
const updateInfo = ref({
    file: [],
    companyId: null,
})

const { sel_option, disabled } = defineProps({
    sel_option: { type: Object },
    disabled: { type: Boolean },
});
const { proxy } = getCurrentInstance();
const rules = ref({
    companyId: [{ required: true, message: "导入公司不能为空", trigger: "blur" }],
});
function validate() {
    return new Promise((resolve, reject) => {
        proxy.$refs["importRef"].validate((valid) => {
            if (updateInfo.value.file.length < 1) {
                proxy.$modal.msgError(`请上传导入文件`);
                resolve(false)
            }
            if (valid) {
                resolve(true)
            } else {
                resolve(false)
            }
        })
    })
}
function downloadTemplate() {
    axios.get('/static/download/导入模板.xls', {
        responseType: 'blob',
    }).then(res => {
        saveAs(res.data, '导入模板.xls');
    })
}
function changeFile(val) {
    let nameArray = val.name.split(".");
    if (nameArray[nameArray.length - 1] == "xlsx" || nameArray[nameArray.length - 1] == "xls" || nameArray[nameArray.length - 1] == "csv") {
        // file保存选择的文件
        updateInfo.value.file = val.raw;
    } else {
        proxy.$modal.msgError(`表格格式错误,请确认表格内容并重新上传`);
    }
}
defineExpose({
    validate,
    updateInfo
});
</script>
<style lang='scss' scoped>
.required {
    color: #f56c6c;
    left: -77px;
    top: 0;
    position: absolute;
}

:deep(.el-upload-list) {
    width: 210px;
}
</style>